<template>
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
        <record-form ref="form" :form="form" />
        <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitForm">确 定</el-button>
            <el-button @click="cancel">取 消</el-button>
        </div>
    </el-dialog>
</template>

<script>
import RecordForm from "./RecordForm";

export default {
    name: "RecordDialog",
    components: {
        RecordForm
    },
    props: {
        // 弹出层标题
        title: {
            type: String,
            default: ""
        },
        // 是否显示弹出层
        open: {
            type: Boolean,
            default: false
        },
        // 表单参数
        form: {
            type: Object,
            default: () => {
                return {
                    id: null,
                    recordCode: null,
                    goodsId: null,
                    recordType: null,
                    recordSubtype: null,
                    recordDate: null,
                    quantity: null,
                    beforeQuantity: null,
                    afterQuantity: null,
                    unitPrice: null,
                    totalAmount: null,
                    supplierId: null,
                    customerId: null,
                    warehouseId: null,
                    targetWarehouseId: null,
                    operatorId: null,
                    operatorName: null,
                    approverId: null,
                    approverName: null,
                    approvalTime: null,
                    approvalStatus: "0",
                    recordStatus: "0",
                    batchNumber: null,
                    expiryDate: null,
                    recordRemark: null
                };
            }
        }
    },
    methods: {
        /** 提交按钮 */
        submitForm() {
            this.$refs["form"].$refs["form"].validate(valid => {
                if (valid) {
                    this.$emit('submit', this.form);
                }
            });
        },
        // 取消按钮
        cancel() {
            this.$emit('cancel');
        }
    }
};
</script>

<style lang="scss" scoped>
.record-dialog {
    .record-dialog-footer {
        text-align: right;
    }
}
</style>